<template>
 <div style="padding: 10px">



     <!--    搜索区域-->
     <div style="margin: 10px 0">
<!--       <el-input placeholder="请输入关键字" style="width: 20%" v-model="search" clearable></el-input>-->





     </div>



   <el-form ref="form" :model="form" label-width="80px">

       <el-form-item label="申请人">
         <el-input v-model="form.applyName"></el-input>

       </el-form-item>
       <el-form-item label="需要时间">
         <el-col :span="11">
           <el-date-picker type="date" placeholder="选择日期" v-model="form.date" style="width: 100%;"></el-date-picker>
         </el-col>

       </el-form-item>
     <el-form-item>

       <el-button type="primary" @click="onSubmit">立即提交</el-button>

     </el-form-item>


     <el-form-item  >
       <span>所需物品 ：</span>
       <input type="text" v-model="form.goodsname">
<!--       <input type="text" v-model.number="form.price">-->

       <el-button @click="insert" >添加</el-button>
     </el-form-item>

   <el-collapse v-model="activeNames" @change="handleChange">
   <el-collapse-item title="所需物品列表" name="1">

     <el-form-item v-for="item,index in form.list">
       名称：{{item.goodsname}}
<!--       单价：{{item.price}}-->


       数量/重量（kg）：
       <el-button @click="decrease(index)">-</el-button>
       <span>{{item.count}}</span>
       <el-button @click="increase(index)">+</el-button>
     </el-form-item>
   </el-collapse-item>
   </el-collapse>
   </el-form>

<!--     <span>总价：{{totalPrice}}</span>-->
<!--   <el-button >购买</el-button>-->

 </div>
 </template>

<script>
import request from "../../utils/request";

export default {
  name: "Replenishment",
  data() {
    return {
    user:'',

      activeNames: ['1'],

      form: {
        list:[],
        goodsname:"",
        price:"",
        applyName:'',
        name: '',
        region: '',
        date1: '',
        date2: '',
        delivery: false,
        type: [],
        resource: '',
        desc: ''
      }
    }
  },
  //计算属性
  computed:{
    // totalPrice(){
    //   let sum = 0;
    //   this.form.list.forEach(v => {
    //     sum +=(v.price*v.count);
    //
    //   })
    //   return sum;
    // }


  },
  created() {
    let user= sessionStorage.getItem("user");
    this.user =JSON.parse(user)//转成字符串
    this.form.applyName =this.user.nickname
  },
  methods: {


    handleChange(val) {
      console.log(val);
    },

    onSubmit() {
      request.post("/replenshment/apply",this.form)
      this.$messageBox({

        type:"success",
        message:"提交成功"
      })
     this.form=''


    },
    insert(){
      if(this.form.goodsname!==''){
        this.form.list.push({

          goodsname:this.form.goodsname,
          // price:this.form.price,
          count:1
        })

      }

    },
    increase(i){
      this.form.list[i].count++

    },
    decrease(i){
      this.form.list[i].count--

      if(this.form.list[i].count<=0 && confirm("是否删除") ){

        this.form.list.splice(i,1)
      }


    }


  }

}
</script>

<style scoped>

</style>